<!-- 编辑信息组件 -->
<template>
  <el-container>
    <el-main>
      <el-card>
        <el-form :model="ruleForm" status-icon :rules="rules" ref="ruleForm" label-width="100px" class="demo-ruleForm">
          <el-form-item label="id" prop="id">
            <el-input v-model="ruleForm.id" :value="ruleForm.id" :disabled="true"></el-input>
          </el-form-item>
          <el-form-item label="密码" prop="newPwd">
            <el-input type="password" v-model="ruleForm.newPwd" autocomplete="off"></el-input>
          </el-form-item>
          <el-form-item label="确认密码" prop="newPwd2">
            <el-input type="password" v-model="ruleForm.newPwd2" autocomplete="off"></el-input>
          </el-form-item>
          <el-form-item>
            <el-button type="primary" @click="submitForm('ruleForm')">提交</el-button>
            <el-button @click="resetForm('ruleForm')">重置</el-button>
          </el-form-item>
        </el-form>
      </el-card>
    </el-main>
  </el-container>
</template>
<script>
export default {
  data() {
    return {
      ruleForm: {
        id: '',
        newPwd:'',
        newPwd2:'',
        oldPwd:''
      },
      type:'',
      name:'',
      rules: {
        newPwd: [
          { required: true, message: '请输入要修改的密码', trigger: 'blur' },
          { min: 3, max: 15, message: '长度在 3 到 15 个字符', trigger: 'blur' }
        ],
        newPwd2: [
          { required: true, message: '请确认要修改的密码', trigger: 'blur' },
          { min: 3, max: 15, message: '长度在 3 到 15 个字符', trigger: 'blur' }
        ],
      },
    };
  },
  created(){
    this.ruleForm.id=localStorage.getItem('studentId');
    this.type=localStorage.getItem('type');
    this.name=localStorage.getItem('name');
  },
  methods: {
    //改成修改密码
    async changePwd(){
    const dataToSerialize ={};
    if (this.ruleForm.id) {
   dataToSerialize.id = this.ruleForm.id;
}
    if (this.ruleForm.newPwd2) {
   dataToSerialize.newPwd = this.ruleForm.newPwd2;
}
if (localStorage.getItem('ps')) {
   dataToSerialize.oldPwd = localStorage.getItem('ps');
}

  dataToSerialize.identify=(this.type=='student'?1:0);

    // JSON化
    const config = {
      headers: {
        'Content-Type': 'application/json', // Custom request header
        'token':`${localStorage.getItem("token")}`// Custom request header
      }
    };
    try {
      const { data: res } = await this.$http.put(`api/user/pwd/update`,JSON.stringify(dataToSerialize),config);
      if (res.status !== 500) {
        this.$message.success(`成功修改${this.name}的密码`);
      
      } else {
        this.$message.error('修改失败');
      }
    } catch (error) {
      // Handle request error
      console.error('Request Error:', error);
      this.$message.error('修改失败');
  }

  
    },
    //提交表单信息
    submitForm(ruleForm) {
        this.$refs[ruleForm].validate((valid) => {
          if (valid) {
            if(this.ruleForm.newPwd==this.ruleForm.newPwd2){this.changePwd();}
            else {this.$message.error('两次密码输入不一致');}
          }
          else{
            this.$message.error('请将信息填写完整');
          }
        });
      },
    resetForm(formName) {
      this.$refs[formName].resetFields();
    }
  }
}
</script>